<template>
  <div class="page invite-index">
    <carouse :data="this.banners"></carouse>
    <div class="invite-serve invite-page">
      <div class="invite-page-center">
        <div class="invite-title">我们的服务</div>
        <div class="invite-title-line"></div>
        <div class="invite-serve-content">
          <el-col :span="8">
            <div class="serve-all">
              <div class="serve-circle serve-safety"></div>
              <div class="serve-text">更安全</div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="serve-all">
              <div class="serve-circle serve-major"></div>
              <div class="serve-text">更专业</div>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="serve-all">
              <div class="serve-circle serve-convenient"></div>
              <div class="serve-text">更便捷</div>
            </div>
          </el-col>
        </div>
      </div>
    </div>
    <div class="invite-content invite-page">
      <div class="invite-page-center">
        <div class="invite-talents-job">
          <div class="invite-title">人才求职服务</div>
          <div class="invite-title-line"></div>
          <div class="invite-talents-content">
            <el-row class="talents-content-row">
              <div class="talents-list">
                <div>
                  <img src="../../assets/img/index/jianli.png" height="80px" alt>
                  简历撰写
                </div>
              </div>

              <div class="talents-list">
                <div>
                  <img src="../../assets/img/index/shipei.png" height="80px" alt>
                  适配分析
                </div>
              </div>
              <div class="talents-list">
                <div>
                  <img src="../../assets/img/index/mianshi.png" height="74px" alt>
                  面试辅导
                </div>
              </div>
            </el-row>
            <el-row class="talents-content-row" style="margin:30px 0 0 0;">
              <div class="talents-list">
                <div>
                  <img src="../../assets/img/index/tanxin.png" height="77px" alt>
                  谈薪辅导
                </div>
              </div>

              <div class="talents-list">
                <div>
                  <img src="../../assets/img/index/offer.png" height="80px" alt>
                  offer选择
                </div>
              </div>
              <div class="talents-list">
                <div>
                  <img src="../../assets/img/index/zijian.png" height="71px" alt>
                  自荐奖金
                </div>
              </div>
            </el-row>
          </div>
        </div>
        <div class="invite-famous-enterprise">
          <div class="invite-title">入驻行业名企</div>
          <div class="invite-title-line"></div>
          <div class="invite-famouse-enterprise">
            <el-row class="famouse-enterprise-row">
              <div class="famouse-list" v-for="item in inCom">
                <img :src="item.image" height="100%" width="100%" alt>
              </div>
            </el-row>
          </div>
        </div>
      </div>
    </div>

    <page-footer></page-footer>
    <el-dialog style="margin-top: 15vh;" :visible.sync="loginDialog" title="提示">
      <all-dialog type="0" v-model="loginDialog"></all-dialog>
    </el-dialog>
  </div>
</template>

<script>
import pageFooter from '../../components/page-footer'
import carouse from './carouse'
import _g from '../../assets/utils/global'
import allDialog from '../../components/all-dialog'

export default {
  data() {
    return {
      data: [],
      banners: [], //人才端首页banner图
      inCom: [], //入驻企业
      loginDialog:false,
    }
  },
  components: { pageFooter, carouse ,allDialog},
  methods: {
    init() {
      let resumeIntegrity = this.$route.query.resumeIntegrity;
      if(resumeIntegrity != undefined){
        if (resumeIntegrity.resumeIntegrity < 90) {
          this.loginDialog = true
        } else if(resumeIntegrity.resumeIntegrity == 90 && resumeIntegrity.onlineResume != 0) {
          this.loginDialog = true
        }
      }
      _g.apiPost('/talent/initPage.do', { state: '4,9' }).then(res => {
        if (res.status == 0) {
          //人才端首页banner图
          let bannerMap = res.data['4']
          bannerMap.forEach(banner => {
            let bannerObj = JSON.parse(banner.content)
            this.banners.push({ image: bannerObj.image, url: bannerObj.url })
          })

          let inputCom = res.data['9'] //入驻企业
          inputCom.forEach(ic => {
            let icObj = JSON.parse(ic.content)
            this.inCom.push({ image: icObj.image })
          })
        }
      })
    }
  },
  created() {
    this.init()
  }
}
</script>

<style lang="scss" scoped>
.serve-circle {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
}
.invite-describe {
  width: 100%;
  height: 478px;
}
.serve-safety {
  background: #f7f7f7 url('../../assets/img/index/anquan.png') no-repeat center;
  &:hover {
    background: #f09338 url('../../assets/img/index/anquan1.png') no-repeat
      center;
  }
}
.serve-major {
  background: #f7f7f7 url('../../assets/img/index/zhuanye.png') no-repeat center;
  &:hover {
    background: #f09338 url('../../assets/img/index/zhuanye1.png') no-repeat
      center;
  }
}
.serve-convenient {
  background: #f7f7f7 url('../../assets/img/index/bianjie.png') no-repeat center;
  &:hover {
    background: #f09338 url('../../assets/img/index/bianjie1.png') no-repeat
      center;
  }
}
</style>
